@import "rootfontsize.css";
.neon-btn {
    display: inline-flex;/* 使按钮内联显示 */
    align-items: center;/* 垂直居中 */
    justify-content: center;/* 水平居中 */
    gap: 0.25rem;/* 内部元素间距 */


    /* 基础形态 */
    background: #1A1A1A;
    border: 0.125rem solid #32CD32;
    color: #32CD32;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    
    /* 科技光边 */
    box-shadow: 
      0 0 0.5rem #32CD32,
      inset 0 0 0.75rem rgba(50,205,50,0.2);
}
  
/* 悬浮态 - 能量充能 */
.neon-btn:hover {
    border-color: #ADFF2F;
    color: #ADFF2F;
    transform: translateY(-0.125rem);
    box-shadow: 
        0 0 1.25rem #ADFF2F,
        inset 0 0 1.875rem rgba(173,255,47,0.3);

    /* 流光动画 */
    &::after {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: linear-gradient(
        45deg,
        transparent 25%,
        rgba(173,255,47,0.4) 50%,
        transparent 75%
        );
        animation: flow 2s infinite linear;
    }
}

/* 点击态 - 能量释放 */
.neon-btn:active {
    background: #32CD32;
    color: #1A1A1A;
    box-shadow: 
        0 0 2.5rem #00FF00,
        inset 0 0 0.9375rem #000;

    /* 点击波纹 */
    &::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background: radial-gradient(circle, #00FF00 10%, transparent 80%);
        animation: ripple 0.6s ease-out;
    }
}

/* 禁用态 - 能量休眠 */
.neon-btn:disabled {
    border-color: #24592A;
    color: #24592A;
    background: #1A1A1A;
    opacity: 0.7;
    box-shadow: none;
}

/* 关键帧动画 */
@keyframes flow {
    0% { transform: translateX(-50%) rotate(45deg); }
    100% { transform: translateX(50%) rotate(45deg); }
}

@keyframes ripple {
    from { transform: scale(0); opacity: 1; }
    to { transform: scale(2); opacity: 0; }
}
/* 能量核心跳动 */
@keyframes core-pulse {
    0%, 100% { opacity: 0.8; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.05); }
}

/* 背景微光扫描 */
.neon-btn::after {
    background: linear-gradient(
    to right,
    transparent 0%,
    #32CD3220 50%,
    transparent 100%
    );
    animation: scan 6s infinite linear;
}